<template>
  <div>
      <mt-swipe :auto="4000" >
      <mt-swipe-item v-for="(img,index) in imgs" :key="index"><router-link to="/index"><img :src="img.img" alt=""></router-link></mt-swipe-item>
      </mt-swipe>
      <ul class="mui-table-view mui-grid-view mui-grid-9">
<!--         这是上面的被我去掉了 mui-table-view-->
          <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
              <router-link :to="{name:'home_news'}">
                  <img src="../../static/images/news.png" alt="">
              <div class="mui-media-body">新闻咨询</div>
              </router-link></li>
          <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link :to="{name:'home_share'}">
              <img src="../../static/images/picShare.png" alt="">
              <div class="mui-media-body">图片分享</div></router-link></li>
          <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
              <router-link :to="{name:'goumai'}">
              <img src="../../static/images/feedback.png" alt="">
              <div class="mui-media-body">商品购买</div>
              </router-link>
          </li>
          <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="#">
              <img src="../../static/images/goodShow.png" alt="">
              <div class="mui-media-body">留言反馈</div></router-link></li>
          <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="#" >
              <img src="../../static/images/callme.png" alt="">
              <div class="mui-media-body">视频专区</div></router-link></li>
          <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="#">
              <img src="../../static/images/search.png" alt="">
              <div class="mui-media-body">联系我们</div></router-link></li>
      </ul>
  </div>
</template>

<script>
    export default {
        data(){
            return {
                imgs:[]
            }
        },
        created(){
            this.Ajax.get("lunbo").then(res=>{
                this.imgs=res.data.message;
                // console.log(this.imgs[0]);
            }).catch(err=>{
                console.log(err);
            })
        }
    }
</script>

<style scoped lang="less">
    /*nav字体大小*/
    .mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body {
        font-size: 12px;
    }
    .mint-swipe {
        height: 230px;
        width: 100%;
        float: left;
        img {
            width: 100%;
            height: 100%;
        }
    }
    ul.mui-table-view {
        position: static;
        background-color: white;
    }
    ul li {
        width: 33.3%;
    }
      .mui-grid-view.mui-grid-9 .mui-table-view-cell {
          border-right: none;
          border-bottom: none;
          padding: 0 35px;
      }
    ul {
         a {
             img {
                 width: 100%;
                 height: 100%;
             }
         }

  }
</style>